<ui:composition template="/WEB-INF/template/default.xhtml" xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html" xmlns:jawr="https://jawr.dev.java.net/jsf/facelets"
	xmlns:a4j="http://richfaces.org/a4j" xmlns:rich="http://richfaces.org/rich">
	<ui:define name="title"> Game </ui:define>
	<ui:define name="content">
		<f:view>
			<h:form id="game">
				<a4j:outputPanel id="loginFragment">
					<h:messages id="messageId" errorStyle="color:red;" infoStyle="color:green;" layout="table" />
					<a4j:poll id="poll" interval="1000" reRender="loginFragment" enabled="#{form.waiting}" />
					<h:panelGrid columns="1" border="0">
						<h:panelGroup>
							<h:outputLabel value="Username:" rendered="#{!form.userLoggedIn}" for="name" />
							<h:inputText id="name" value="#{form.name}" rendered="#{!form.userLoggedIn}" size="11" required="true"
								requiredMessage="#{msg.username_field_required}" maxlength="8" />
							<rich:message for="name" errorStyle="color:red;" />
						</h:panelGroup>
						<h:panelGroup>
							<h:outputLabel value="Password:" rendered="#{!form.userLoggedIn}" for="password" />
							<h:inputSecret id="password" value="#{form.password}" rendered="#{!form.userLoggedIn}" size="11" maxlength="8" required="true"
								requiredMessage="#{msg.password_field_required}" />
							<rich:message for="password" errorStyle="color:red;" />
						</h:panelGroup>
						<h:panelGroup>
							<a4j:commandButton id="login" value="Login" action="loginUser" rendered="#{!form.userLoggedIn}" reRender="#{flowRenderFragments}" />
						</h:panelGroup>
						<h:panelGroup>
							<h:outputText id="name" value="Player: #{form.name}" rendered="#{form.userLoggedIn}" />
						</h:panelGroup>
						<h:panelGroup>
							<h:outputText value="Loss: #{form.loss}" rendered="#{form.userLoggedIn}" />
						</h:panelGroup>
						<h:panelGroup>
							<h:outputText value="Win: #{form.win}" rendered="#{form.userLoggedIn}" />
						</h:panelGroup>
						<h:panelGroup>
							<h:outputText id="creature" value="Creature: #{form.creature}" rendered="#{form.userLoggedIn}" />
						</h:panelGroup>
						<h:panelGroup>
							<h:outputText value="#{form.gameResult}" rendered="#{form.userLoggedIn}" />
						</h:panelGroup>
						<h:panelGroup>
							<h:outputText id="counter" value="#{form.counterText}" rendered="#{form.waiting}" />
						</h:panelGroup>
						<h:panelGroup>
							<a4j:commandButton id="attack" value="Attack!" action="attack" rendered="#{form.userLoggedIn }" disabled="#{form.waiting}"
								reRender="#{flowRenderFragments}" />
							<a4j:commandButton id="runAway" value="Run Away!" action="runAway" rendered="#{form.userLoggedIn }" disabled="#{form.waiting}"
								reRender="#{flowRenderFragments}" />
						</h:panelGroup>
						<f:facet name="footer">
							<h:panelGroup>
								<a4j:commandButton id="logout" value="Log out" action="logOutUser" rendered="#{form.userLoggedIn}" reRender="#{flowRenderFragments}" />
							</h:panelGroup>
						</f:facet>
					</h:panelGrid>
				</a4j:outputPanel>
			</h:form>
		</f:view>
	</ui:define>
</ui:composition>
